アーカイブ 2025.01.26

Elemental / Atomos

・ミストヴィレッジ　18-41　ドットハウス　　　

Elemental / Carbuncle

・ゴブレットビュー　43-73　3号室

https://i.gyazo.com/d93fdf366edc9e8157b6b9d5ef63dfcf.png

code:RUN.html

code:RUN.css

code:RUN.js

// 画像URLのリスト

const imageURLs = [

// 他の画像URLもここに追加

];

// スライドコンテナの作成

const slideContainer = document.createElement('div');

slideContainer.style.position = 'fixed';

slideContainer.style.top = '0';

slideContainer.style.left = '0';

slideContainer.style.width = '100vw';

slideContainer.style.height = '100vh';

slideContainer.style.display = 'flex';

slideContainer.style.justifyContent = 'center';

slideContainer.style.alignItems = 'center';

slideContainer.style.backgroundColor = 'rgba(0,0,0,0.8)';

slideContainer.style.zIndex = '9999';

// 画像要素の作成

const slideImage = document.createElement('img');

slideImage.style.maxWidth = '95%';

slideImage.style.maxHeight = '95%';

slideImage.style.objectFit = 'contain'; // アスペクト比を保持

slideImage.style.transition = 'opacity 0.7s ease-in-out'; // フェードエフェクト追加

// 画像をコンテナに追加

slideContainer.appendChild(slideImage);

// スライドショー機能

function startSlideshow() {

let currentIndex = 0;

// コンテナをbodyに追加

document.body.appendChild(slideContainer);

// 画像変更関数

function changeImage() {

// 画像の読み込み

const img = new Image();

img.onload = function() {

// フェードアウト

slideImage.style.opacity = '0';

// 少し遅延を入れてから新しい画像に切り替え

setTimeout(() => {

slideImage.src = this.src;

slideImage.style.opacity = '1';

}, 500);

};

img.onerror = function() {

// 次の画像に進む

currentIndex = (currentIndex + 1) % imageURLs.length;

};

// インデックスを更新

currentIndex = (currentIndex + 1) % imageURLs.length;

}

// 最初の画像読み込み

changeImage();

// 5秒ごとに画像を変更

const intervalId = setInterval(changeImage, 5000);

// クリックで終了

slideContainer.addEventListener('click', () => {

clearInterval(intervalId);

document.body.removeChild(slideContainer);

audio.pause(); // BGM停止

BeepAndReload();

});

}

// スライドショーの開始

startSlideshow();

// BGMの再生 (URLで指定)

// BGMのURL

const audio = new Audio(audioURL);

audio.loop = true; // ループ再生

audio.play();